
<html>
<head>
	<h1>
		This is a HTML Page
	</h1>
	<!-- JavaScript脚本，主要包括了按钮要执行的函数，显示对话框等 -->
	<script type="text/javascript">
    //JavaScript方法，弹出对话框显示信息
    function myFunction()
    {
        alert("Hello World!");
    }
    function onAlert()
    {
        console.log("onAlert method");//显示调试信息
        alert("This is a alert sample from html");
    }
    function onConfirm()
    {
        console.log("onConfirm method");
        var b = confirm("are you sure to login?");
        alert("your choice is " + b);
    }
    function onPrompt()
    {
        console.log("onPrompt method");
        var b = prompt("please input your password", "aaa");
        alert("your input is " + b);
    }

    //调用绑定的Java对象的方法，即调用Android代码显示对话框
    function showAndroidToast(toast)
    {
        console.log("showAndroidToast method");
        myInterfaceName.showToast(toast);//注意此处的myInterfaceName要和外部传入的名字一致，大小写正确
    }
</script>
</head>
<body>

<p>
	<!-- 前四个按钮调用JS函数 -->
	JavaScript函数调用 <br />
	<button onclick="myFunction()">点击这里!</button>
	<br />
	<input type="button" value="alert" onclick="onAlert()" /> <br />
	<input type="button" value="confirm" onclick="onConfirm()" /> <br />
	<input type="button" value="prompt" onclick="onPrompt()" /><br />
	<!-- 上面用了两种定义按钮的方式，效果一样的 -->
</p>

<p>
	<!-- 这个Say hello 按钮调用Android代码中的方法 -->
	用JavaScript按钮调用Android代码 <br />
	<input type="button"
		   value="Say hello" onClick="showAndroidToast('Hello Android!')" />
</p>

<a href="https://www.baidu.com/" />Google
</a>

</body>
</html>